const {defineConfig} = require('@vue/cli-service')
const AutoImport = require('unplugin-auto-import/webpack')
const Components = require('unplugin-vue-components/webpack')
const { ElementPlusResolver } = require('unplugin-vue-components/resolvers')
const CompressionPlugin = require("compression-webpack-plugin"); // 开启gzip压缩， 按需引用


module.exports = defineConfig({
    lintOnSave: false,
    transpileDependencies: true,
    css: {
        loaderOptions: {
            sass: {
                additionalData: `@use "@/style/global.scss" as *;`
            }
        }
    },
    configureWebpack: {
        plugins: [
            AutoImport({
                imports: [
                    'vue', 'vue-router', '@vueuse/core'
                ],
                eslintrc: {
                    enabled: false,
                    filepath: './.eslintrc-auto-import.json',
                    globalsPropValue: true
                },
                dts: './src/auto-import.d.ts',
                resolvers: [ElementPlusResolver({
                    importStyle: 'css',
                })]
            }),
            Components({
                resolvers: [ElementPlusResolver()]
            }),
            new CompressionPlugin({
                algorithm: 'gzip', // 使用gzip压缩
                test: /\.js$|\.html$|\.css$/, // 匹配文件名
                filename: '[path][base].gz[query]', // 压缩后的文件名(保持原文件名，后缀加.gz)
                threshold: 10240,
                minRatio: 0.8
            }),
        ],
    },
    productionSourceMap: false,
})
